<template>
    <div class="header">
        <div class="header-left">
            <span @click="$router.go(-1)" v-if="!$route.meta.noBack">
                <i class="iconfont iconfanhui"></i>
            </span>
        </div>
        <h3>
            {{$route.meta.title}}
        </h3>
        <div class="header-right">
            <span id="hr_html"></span>
        </div>
    </div>
</template>

<script>
    export default {
        methods:{

        }
    }
</script>

<style scoped lang="less">
    @font-color:white;
    @bg-color:red;
    .header{
        position: fixed;
        top: 0;
        width: 100%;
        height: 45px;
        background: @bg-color;
        border-bottom: 1px solid #eee;
        box-sizing: border-box;
        display: flex;
        justify-content: space-between;
        align-items: center;
        z-index: 10;
        &>div{
            width: 100px;
        }
        .header-left{
            span{
                display: inline-block;
                height: 100%;
                padding: 0 12px;
                i{
                    font-size: 20px;
                    color: @font-color;
                }
            }
        }
        h3{
            font-size: 18px;
            color: @font-color;
            font-weight: normal;
        }
        .header-right{
            text-align: right;
            span{
                display: inline-block;
                height: 100%;
                padding: 0 12px;
                font-size: 15px;
                color:@font-color;
            }
        }
    }
</style>
